<template>
	<view class="app app-bg">
		<!-- 页面内容开始 -->
		<view style="height: 20rpx;"></view>
		<!-- 订单状态（如：付款成功，等待商家发货） -->
		<view class="card">
			<view class="card-title" style="color: #ff4444;margin-bottom: 20rpx;">{{ status1Fn(data.orderInfo.status) || "" }}
				<text style="color: #909399;" v-if="awaitTime">（已等待 {{ awaitTime }}）</text>
				<text style="color: #909399;font-size: 24rpx;" v-if="[1,2].indexOf(data.orderInfo.status) > -1 && vk.getVuex('$user.mchInfo.order.plan_send')">预计 {{ vk.getVuex('$user.mchInfo.order.plan_send') }} 天内发货</text>
			</view>
			<view class="card-title" style="font-size: 40rpx;margin-bottom: 20rpx;">{{ status2Fn(data.orderInfo.status) }}</view>
			<view v-if="data.orderInfo.status == 0" style="display: flex;">
				<text>若未付款，则订单将在</text>
				<u-count-down :timestamp="countDownTimeCom" format="mm分ss秒" :customStyle="{color:'#ff4444',margin:'0 10rpx'}" @end="countDownEnd"></u-count-down>
				<text>后自动取消！</text>
			</view>
		</view>
		<view class="card" v-if="data.orderInfo.status === 5" style="font-weight: bold;">
			<text>{{ vk.getVuex('$user.mchInfo.order.receive_tips') || '感谢您的支持，评价送积分' }}</text>
			<text style="margin-left: 20rpx;color: var(--main);text-decoration: underline;" @click="pageToComment">点我评论</text>
		</view>
		<view class="card" v-else-if="data.orderInfo.status === -1" style="font-weight: bold;">
			<text>{{ vk.getVuex('$user.mchInfo.order.cancel_tips') || '感谢您的支持，期待下次购买' }}</text>
			<text style="margin-left: 20rpx;color: var(--main);text-decoration: underline;" @click="pageToGwc(data.orderInfo)">再来一单</text>
		</view>
		<view class="card" v-else-if="data.orderInfo.status === 6" style="font-weight: bold;">
			<text>{{ vk.getVuex('$user.mchInfo.order.complete_tips') || '感谢您的支持，期待下次购买' }}</text>
			<text style="margin-left: 20rpx;color: var(--main);text-decoration: underline;" @click="pageToGwc(data.orderInfo)">再来一单</text>
		</view>
		<!-- 付款流程 等待付款 商家发货 确认收货 交易完成 -->
		<view class="card" v-if="steps1.index !== undefined">
			<u-steps :list="stepsListCom" :current="steps1.index" active-color="var(--main)"></u-steps>
		</view>
		<!-- 退款流程 发起退款 等待审核 退款中 交易关闭 -->
		<view class="card" v-else-if="steps2.index !== undefined">
			<u-steps :list="steps2.list" :current="steps2.index" active-color="var(--main)"></u-steps>
		</view>
		<!-- 收货地址信息展示 收货人 手机号 地址（虚拟商品不需要展示地址，取而代之的是展示核销码-->
		<view class="card address-info" v-if="data.orderInfo.order_type === 0">
			<view class="address-user">
				<view class="address-nickname"><u-icon name="vk-mall-icon-ditu" size="40"></u-icon><text class="nickname">{{ data.orderInfo.express_info.receiver_name }}</text></view>
				<view class="address-mobile">{{ data.orderInfo.express_info.receiver_mobile }}</view>
			</view>
			<view class="address-text">{{ data.orderInfo.express_info.formatted_address }}</view>
			<view class="address-navigation" v-if="data.orderInfo.delivery_mode === 2" @click="navigationShop">导航到门店</view>
		</view>
		<view class="card qrcode-view" v-else-if="data.orderInfo.status > 0 && data.orderInfo.order_type === 1">
			<view class="qrcode-title">核销码</view>
			<view class="qrcode">
				<vk-data-qrcode :text="data.orderInfo._id" :size="350"></vk-data-qrcode>
				<view v-if="!maxVerifyNum" class="verified">
					已核销
				</view>
			</view>
			<view class="qrcode-btn">
				<u-button type="error" size="medium" @click="orderVerify.show = true">快速核销</u-button>
			</view>
			<view class="qrcode-tips">
				<u-alert-tips type="error" description="友情提醒：请让工作人员进行核销，请勿自行核销，否则商家可能不承认您的订单，从而对你造成损失。" :desc-style="{fontSize: '24rpx'}"></u-alert-tips>
			</view>
			<view class="qrcode-tips" v-if="data.orderInfo.goods_sku_list[0].verify_exp_time>0">
				<u-alert-tips type="warning" :description="'有效期：'+vk.pubfn.timeFormat(data.orderInfo.goods_sku_list[0].verify_start_time,'yyyy-MM-dd hh:mm') +' - '+vk.pubfn.timeFormat(data.orderInfo.goods_sku_list[0].verify_exp_time,'yyyy-MM-dd hh:mm') " :desc-style="{fontSize: '24rpx'}"></u-alert-tips>
			</view>
			<u-popup v-model="orderVerify.show" mode="bottom" height="98%" safe-area-inset-bottom border-radius="40" blur="10" closeable>
				<view style="display: flex;flex-direction: column; padding: 30rpx;height: 100%;">
					<view style="flex: 1;">
						<view style="font-weight: bold;font-size: 34rpx;">商品信息</view>
						<view style="margin-top: 20rpx;">
							<vk-mall-order-goods-list :list="data.orderInfo.goods_sku_list"></vk-mall-order-goods-list>
						</view>
						<view style="margin-top: 20rpx;">
							当前可核销数量：{{ maxVerifyNum }}
						</view>
						<view style="display: flex;align-items: center;margin-top: 20rpx;">
							<view style="flex: 1;">本次核销的数量</view>
							<u-number-box v-if="maxVerifyNum" v-model="orderVerify.num" :min="maxVerifyNum>0?1:0" :max="maxVerifyNum"></u-number-box>
							<text v-else>已全部核销完</text>
						</view>
						<view class="qrcode-tips">
							<u-alert-tips type="error" description="友情提醒：请让工作人员进行核销，请勿自行核销，否则商家可能不承认您的订单，从而对你造成损失。" :desc-style="{fontSize: '24rpx'}"></u-alert-tips>
						</view>
						<view class="qrcode-tips" v-if="data.orderInfo.goods_sku_list[0].verify_exp_time>0">
							<u-alert-tips type="warning" :description="'有效期：'+vk.pubfn.timeFormat(data.orderInfo.goods_sku_list[0].verify_start_time,'yyyy-MM-dd hh:mm') +' - '+vk.pubfn.timeFormat(data.orderInfo.goods_sku_list[0].verify_exp_time,'yyyy-MM-dd hh:mm') " :desc-style="{fontSize: '24rpx'}"></u-alert-tips>
						</view>
						<view style="margin-top: 20rpx;flex: 1;">
							<view style="font-weight: bold;font-size: 34rpx;">订单时间线</view>
							<scroll-view scroll-y="true" style="height: 420rpx;margin-top: 20rpx;" @touchmove.stop>
								<u-time-line>
									<u-time-line-item nodeTop="2" v-for="(item,index) in data.orderInfo.timeline" :key="index">
										<!-- 此处自定义了左边内容，用一个图标替代 -->
										<template v-slot:content>
											<view v-if="item.oper_type == 'my'">
												<view class="u-order-title">{{ item.msg }}</view>
												<view class="u-order-time">{{ vk.pubfn.timeFormat(item.time) }}</view>
											</view>
											<view v-else style="text-align: right;">
												<view class="u-order-title">{{ item.msg }}</view>
												<view class="u-order-time">{{ vk.pubfn.timeFormat(item.time) }}</view>
											</view>
										</template>
									</u-time-line-item>
								</u-time-line>
							</scroll-view>
						</view>
					</view>
					<view>
						<u-button type="success" @click="orderFistVerify" :disabled="!maxVerifyNum">确定核销</u-button>
					</view>
				</view>
			</u-popup>
		</view>
		<!-- 商品信息列表 -->
		<view class="card">
			<u-read-more close-text="查看全部商品" show-height="550" color="#303133" text-indent="0" v-if="data.orderInfo.goods_sku_list && data.orderInfo.goods_sku_list.length>0">
				<vk-mall-order-goods-list :list="data.orderInfo.goods_sku_list"></vk-mall-order-goods-list>
			</u-read-more>
			<view style="text-align: right;margin-top: 30rpx;">共<text class="bold" style="margin: 0 10rpx;">{{ buyGoodsNumFn(data.orderInfo.goods_sku_list) }}</text>件
			商品小计：<text class="bold">¥{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.goods_amount) }}</text></view>
		</view>
		<!-- 订单信息 订单编号 创建时间 付款时间 发货时间 退款时间  -->
		<view class="card" style="font-size: 26rpx;">
			<view class="cell-box">
				<view class="cell-left">订单编号</view>
				<view class="cell-right bold"><text>{{ data.orderInfo.order_no }}</text><text style="margin-left: 10rpx;color: var(--main);" @click="copy(data.orderInfo.order_no)">复制</text></view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.transaction_id">
				<view class="cell-left">交易编号</view>
				<view class="cell-right bold"><text>{{ data.orderInfo.transaction_id }}</text><text style="margin-left: 10rpx;color: var(--main);" @click="copy(data.orderInfo.transaction_id)">复制</text></view>
			</view>
			<view class="cell-box">
				<view class="cell-left">创建时间</view>
				<view class="cell-right">{{ vk.pubfn.timeFormat(data.orderInfo._add_time) }}</view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.pay_time">
				<view class="cell-left">付款时间</view>
				<view class="cell-right">{{ vk.pubfn.timeFormat(data.orderInfo.pay_time) }}</view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.pay_type">
				<view class="cell-left">付款方式</view>
				<view class="cell-right">{{ payTypeCom }}</view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.send_time">
				<view class="cell-left">发货时间</view>
				<view class="cell-right">{{ vk.pubfn.timeFormat(data.orderInfo.send_time) }}</view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.refund_time">
				<view class="cell-left">退款时间</view>
				<view class="cell-right">{{ vk.pubfn.timeFormat(data.orderInfo.refund_time) }}</view>
			</view>
		</view>
		<!-- 金额信息 商品金额 运费 会员优惠 优惠券抵扣 积分抵扣 活动优惠 实付金额 余额支付 现金支付-->
		<view class="card" style="font-size: 26rpx;">
			<view class="cell-box">
				<view class="cell-left">商品金额</view>
				<view class="cell-right bold">{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.goods_amount) }}</view>
			</view>
			<view class="cell-box">
				<view class="cell-left">运费</view>
				<view class="cell-right bold">{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.express_amount) }}</view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.discount_info.vip_discount_amount">
				<view class="cell-left">会员优惠</view>
				<view class="cell-right bold main-color">-{{ vk.pubfn.priceFilter(data.orderInfo.discount_info.vip_discount_amount) }}</view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.discount_info.coupon_discount_amount">
				<view class="cell-left">优惠券抵</view>
				<view class="cell-right bold main-color">-{{ vk.pubfn.priceFilter(data.orderInfo.discount_info.coupon_discount_amount) }}</view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.discount_info.integral_discount_amount">
				<view class="cell-left">积分抵扣</view>
				<view class="cell-right bold main-color">-{{ vk.pubfn.priceFilter(data.orderInfo.discount_info.integral_discount_amount) }}</view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.discount_info.seckill_discount_amount">
				<view class="cell-left">秒杀优惠</view>
				<view class="cell-right bold main-color">-{{ vk.pubfn.priceFilter(data.orderInfo.discount_info.seckill_discount_amount) }}</view>
			</view>
			<view class="cell-box" v-if="data.orderInfo.discount_info.business_discount_amount">
				<view class="cell-left">商家优惠</view>
				<view class="cell-right bold main-color">-{{ vk.pubfn.priceFilter(data.orderInfo.discount_info.business_discount_amount) }}</view>
			</view>
			<view class="cell-box" style="border-top: 2rpx solid #f3f3f3;">
				<view class="cell-left">应付金额</view>
				<view class="cell-right bold main-color">{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.should_payment_amount) }}</view>
			</view>

			<view class="vk-contents" v-if="data.orderInfo.amount_info.payment_amount && data.orderInfo.amount_info.need_payment_amount">
				<view class="cell-box">
					<view class="cell-left">已付金额</view>
					<view class="cell-right bold main-color">{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.payment_amount) }}</view>
				</view>
				<view class="cell-box">
					<view class="cell-left">还需支付金额</view>
					<view class="cell-right bold main-color">{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.need_payment_amount) }}</view>
				</view>
			</view>

			<view class="vk-contents" v-else>
				<view class="cell-box" v-if="data.orderInfo.amount_info.payment_amount">
					<view class="cell-left">实付金额</view>
					<view class="cell-right bold main-color">{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.payment_amount) }}</view>
				</view>
				<view class="cell-box" v-if="data.orderInfo.amount_info.used_balance_amount && data.orderInfo.amount_info.used_cash_amount">
					<view class="cell-left">使用余额付款</view>
					<view class="cell-right bold">{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.used_balance_amount) }}</view>
				</view>
				<view class="cell-box" v-if="data.orderInfo.amount_info.used_balance_amount && data.orderInfo.amount_info.used_cash_amount">
					<view class="cell-left">使用现金付款</view>
					<view class="cell-right bold">{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.used_cash_amount) }}</view>
				</view>
			</view>

			<view class="vk-contents" v-if="data.orderInfo.amount_info.refund_amount">
				<view class="cell-box">
					<view class="cell-left">已退金额</view>
					<view class="cell-right bold">{{ vk.pubfn.priceFilter(data.orderInfo.amount_info.refund_amount) }}</view>
				</view>
			</view>

			<view class="vk-contents" v-if="data.orderInfo.amount_info.give_integral">
				<view class="cell-box" style="border-top: 2rpx solid #f3f3f3;" v-if="data.orderInfo.amount_info.give_integral">
					<view class="cell-left">奖励积分</view>
					<view class="cell-right bold">{{ data.orderInfo.amount_info.give_integral }}</view>
				</view>
				<view class="cell-box" v-if="data.orderInfo.amount_info.refund_give_integral">
					<view class="cell-left">扣除积分（因退款）</view>
					<view class="cell-right bold">{{ data.orderInfo.amount_info.refund_give_integral }}</view>
				</view>
			</view>



		</view>

		<!-- 按钮区 取消订单 查看物流 确认收货 立即付款 -->
		<!-- 底部安全区域 -->
		<view class="safe-area-inset-bottom"></view>
		<view class="navigation">
			<view class="navigation-main" v-if="data.orderInfo.status != -1">
				<view class="navigation-main-left">
					<view class="navigation-btn cancel" @click="cancel" v-if="data.orderInfo.status === 0">取消订单</view>
					<view class="navigation-btn cancel" @click="applyRefund" v-if="showApplyRefundCom">申请退款</view>
					<view class="navigation-btn main" @click="cancelRefund" v-if="data.orderInfo.status === -2">取消退款</view>
				</view>

				<view class="navigation-main-right">
					<!-- <view class="navigation-btn main">确认收货</view> -->
					<!-- #ifdef MP-WEIXIN -->
					<button
						class="contact"
						:plain="true"
						open-type="contact"
						:send-message-title="data.orderInfo.order_no"
						:show-message-card="true"
						session-from="order-detail"
					>
						<view class="navigation-btn">客服</view>
					</button>
					<!-- #endif -->
					<!-- #ifndef MP-WEIXIN -->
					<view class="navigation-btn" @click="vk.navigateTo('/pages/service-center/service-center');">客服</view>
					<!-- #endif -->
					<view class="navigation-btn" v-if="data.orderInfo.status >0 && data.orderInfo.express_info.express_no" @click="expressInfo">查看物流</view>
					<view class="navigation-btn main" v-if="data.orderInfo.status === 0" @click="payType.show = true">立即付款</view>
				</view>
			</view>
			<view class="navigation-inset-bottom"></view>
		</view>

		<!-- 弹窗 - 支付方式选择 -->
		<pay-action-sheet v-model="payType.show" :userInfo="vk.getVuex('$user.userInfo')" :orderInfo="data.orderInfo" @click="pay"></pay-action-sheet>
		<!-- 订单支付插件 -->
		<pay-order ref="vkPay"></pay-order>

		<!-- 页面内容结束 -->
		<!-- 客服浮球组件 -->
	<!-- 	<vk-mall-contact-service></vk-mall-contact-service> -->
		<!-- 全局公共浮球导航模块 -->
		<vk-data-float-ball :scroll-top="scrollTop"></vk-data-float-ball>
		<vk-data-loading v-model="loading" delayTime="0"></vk-data-loading>
	</view>
</template>

<script>
	var vk = uni.vk; // vk依赖
	import payActionSheet from "./components/pay-action-sheet.vue"
	import payOrder from "./components/pay-order.vue"
	export default {
		components:{
			payActionSheet,
			payOrder
		},
		data() {
			// 页面数据变量
			return {
				// init请求返回的数据
				data:{
					orderInfo:{
						status:"",
						buyer_info:{
							nickname:"",
							avatar:"",
						},
						order_no:"",
						transaction_id:"",
						amount_info:{
							total_amount:"",
							goods_amount:"",
							original_express_amount:"",
							express_amount:"",
							should_payment_amount:"",
							payment_amount:"",
							need_payment_amount:"",
							used_balance_amount:"",
							used_cash_amount:"",
							refund_amount:"",
							refund_balance_amount:"",
							refund_cash_amount:"",
						},
						discount_info:{
							used_account_points:"",
							used_vip_id:"",
							used_coupon_id:"",
							total_discount_amount:"",
							integral_discount_express_amount:"",
							balance_discount_express_amount:"",
							vip_discount_amount:"",
							integral_discount_amount:"",
							balance_discount_amount:"",
							coupon_discount_amount:"",
							business_discount_amount:"",
							seckill_discount_amount:"",
						},
						buyer_remark:"",
						seller_remark:"",
						goods_sku_list:[],
						express_info:{
							position:{

							},
							formatted_address:"",
							mode:"",
							receiver_name:"",
							receiver_mobile:"",
							send_name:"",
							send_mobile:"",
							express_name:"",
							express_no:"",
						},
						auto_cancel_time:"",
						pay_time:"",
						cancel_time:"",
						send_time:"",
						apply_refund_time:"",
						refund_time:"",
						confirm_receive_time:"",
						comment_time:"",
						complete_time:"",
						close_time:""
					}
				},
				// 表单请求数据
				form1:{

				},
				scrollTop:0,
				loading:false,
				steps1:{
					index:0,
					list:[
						{ name: '等待付款' },
						{ name: '商家发货' },
						{ name: '确认收货' },
						{ name: '等待评价' },
						{ name: '交易完成' }
					],
					list2:[
						{ name: '等待付款' },
						{ name: '商家发货' },
						{ name: '等待核销' },
						{ name: '等待评价' },
						{ name: '交易完成' }
					],
					list3:[
						{ name: '等待付款' },
						{ name: '到店自提' },
						{ name: '确认收货' },
						{ name: '等待评价' },
						{ name: '交易完成' }
					]
				},
				steps2:{
					index:0,
					list:[
						{ name: '发起退款' },
						{ name: '等待审核' },
						{ name: '退款中' },
						{ name: '交易关闭' }
					]
				},
				countDownTime:0,
				payType:{
					show:false
				},
				awaitTime:"",
				orderVerify:{
					show:false,
					num:1
				}
			}
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		// 监听 - 页面每次【加载时】执行(如：前进)
		onLoad(options = {}) {
			vk = uni.vk;
			this.options = options;
			this.init(options);
		},
		// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
		onReady(){
			let { options={} } = this;
			// 在onReady内执行是为了先让组件加载完成
			// 如果是同步回调过来的，执行下查询
			if (options.return && options.out_trade_no) {
				this.form1.out_trade_no = options.out_trade_no;
				this.$refs.vkPay.checkPayment(options.out_trade_no);
			}
		},
		// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
		onShow() {
			this.runTimer1();
		},
		// 监听 - 页面每次【隐藏时】执行(如：返回)
		onHide() {
			this.clearTimer1();
		},
		// 监听 - 页面每次【卸载时】（一般用于取消页面上的监听器）
		onUnload(){
			this.clearTimer1();
		},
		// 函数
		methods: {
			// 页面数据初始化函数
			init(options){
				let that = this;
				console.log("init: ",options);
				uni.setNavigationBarTitle({
					title: "订单付款"
				});
				vk.callFunction({
					url: 'client/order.getInfo',
					loading:true,
					data:{
						_id: options._id,
						order_no: options.order_no,
						user: true
					},
					success:(data) => {
						that.initOrder(data.orderInfo);
					},
					fail:(data) => {
						vk.alert(data.msg, ()=>{
							if (data.code === -2) {
								vk.navigateToHome();
							}
						});
					}
				});
			},
			initOrder(orderInfo){
				let that = this;
				that.data.orderInfo = orderInfo;
				that.steps1.index = that.steps1Fn(orderInfo.status);
				that.steps2.index = that.steps2Fn(orderInfo.status);
				if (orderInfo.status === -1) {
					that.steps1 = {
						index:1,
						list:[
							{ name: '等待付款' },
							{ name: '订单取消' },
						]
					};
				}
				const eventChannel = that.getOpenerEventChannel(); // that 需指向 this
				if (eventChannel.emit) eventChannel.emit('update', orderInfo); // 触发A页面的 update 监听事件
				if (that.options.pay == "1" && orderInfo.status === 0) {
					setTimeout(() => {
						that.payType.show = true;
					}, 100);
				}
				that.runTimer1();
			},
			// 运行1号定时器
			runTimer1(){
				let that = this;
				let orderInfo = that.data.orderInfo || {};
				if ([-2, 1,2].indexOf(orderInfo.status) > -1) {
					let keyName = "pay_time";
					if (orderInfo.status === -2) {
						keyName = "apply_refund_time";
					}
					if (orderInfo[keyName])	that.awaitTime = that.getCalcTime(orderInfo[keyName]);
					that.clearTimer1();
					that.timer1 = setInterval(() => {
						if (orderInfo[keyName])	that.awaitTime = that.getCalcTime(orderInfo[keyName]);
					}, 1000);
				}
			},
			// 取消1号定时器
			clearTimer1(){
				let that = this;
				if (that.timer1) clearInterval(that.timer1);
			},
			copy(text){
				uni.setClipboardData({
					data: text,
					success: () => {
						vk.toast('复制成功');
					}
				});
			},
			// 取消订单
			cancel(){
				let that = this;
				vk.confirm("确定取消订单吗？取消后不可恢复！","提示","确定取消","再想想",(res) => {
					if(res.confirm){
						// 点击确定按钮后的回调
						that.cancelOrder();
					}
				});
			},
			cancelOrder(){
				let that = this;
				vk.callFunction({
					url: 'client/order.cancel',
					loading:true,
					data:{
						order_no: that.options.order_no
					},
					success:(data) => {
						that.initOrder(data.orderInfo);
					}
				});
			},
			// 查看快递信息
			expressInfo(){
				let item = this.data.orderInfo;
				vk.navigateTo(`/pages/user/order/express?name=${item.express_info.express_name}&no=${item.express_info.express_no}&phone=${item.express_info.receiver_mobile}`);
			},
			// 立即付款
			pay(payType){
				let that = this;
				// 防抖函数
				vk.pubfn.debounce(() => {
					if (payType === "balance") {
						// 余额支付
						vk.confirm('确定使用余额付款吗？', '提示', '确定', '取消', res => {
							if (res.confirm) {
								vk.callFunction({
									url: 'client/order.balancePay',
									title: '支付中...',
									data: {
										_id: that.data.orderInfo._id
									},
									success: (data) => {
										that.payType.show = false;
										vk.toast(data.msg,"ok");
										that.initOrder(data.orderInfo);
									},
									// fail: (data) => {

									// }
								});
							}
						});
					} else if (payType === "alipay" || payType === "wxpay") {
						// 支付宝或微信支付
						that.payType.show = false;
						that.$refs.vkPay.createPayment({
							provider: payType,
							orderInfo: that.data.orderInfo,
							success:(data) => {
								vk.toast(data.msg,"ok");
								if (vk.pubfn.isNotNull(data.orderInfo)) {
									that.initOrder(data.orderInfo);
								}
							}
						});
					}
				}, 600);

			},
			// 申请退款
			applyRefund(){
				let that = this;
				vk.navigateTo({
					url: `./refund/goods-refund?_id=${that.data.orderInfo._id}`,
					events: {
						// 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
						update: (data) => {
							// 当B页面运行 eventChannel.emit('update', { a:1 }); 时，会运行这里的代码逻辑。
							that.initOrder(data);
						}
					},
					success: (res) => {
						// 通过eventChannel向被打开页面传送数据
						res.eventChannel.emit('data', that.data.orderInfo);
					}
				});
			},
			// 取消退款
			cancelRefund(){
				let that = this;
				vk.confirm('确定取消退款吗？', '提示', '取消退款', '点错了', res => {
					if (res.confirm) {
						vk.callFunction({
							url: 'client/order.cancelRefund',
							title: '请求中...',
							data: {
								_id: that.data.orderInfo._id
							},
							success: (data) => {
								that.initOrder(data.orderInfo);
								vk.alert(data.msg, "提示", "好的");
							}
						});
					}
				});
			},
			buyGoodsNumFn(list){
				let buy_num = 0;
				list.map((item, index) => {
					buy_num += item.buy_num
				});
				return buy_num;
			},
			steps1Fn(status){
				let obj = {
					"-1":1,
					"0":0,
					"1":1,
					"2":1,
					"3":2,
					"4":2,
					"5":3,
					"6":4
				};
				return obj[status.toString()];
			},
			steps2Fn(status){
				let obj = {
					"-4":3,
					"-3":3,
					"-2":1,
				};
				return obj[status.toString()];
			},
			status1Fn(status) {
				let obj = vk.getVuex('$app.config.maill.order.status');
				return obj[status.toString()] || "";
			},
			status2Fn(status) {
				let obj = vk.getVuex('$app.config.maill.order.status2');
				let str = obj[status.toString()];
				if (this.data.orderInfo.order_type === 1 && this.data.orderInfo.status === 4) {
					str = "等待核销";
				} else if (this.data.orderInfo.delivery_mode === 2 && str === "等待商家发货") {
					str = "请到店自提";
				}
				return str;
			},
			// 倒计时结束
			countDownEnd(){
				let that = this;
				let status = vk.pubfn.getData(that.data, 'orderInfo.status');
				if (status === 0) {
					// 尝试取消订单
					that.cancelOrder();
				}
			},
			getCalcTime(calcTime){
				let that = this;
				let time = parseInt((Date.now() - calcTime) / 1000);
				if (time<0) time = 0;
				let mm = parseInt(time / 60);
				let ss = parseInt(time - mm * 60);
				let hh = parseInt(mm / 60);
				mm = parseInt(mm - hh * 60);
				let dd = parseInt(hh / 24);
				hh = parseInt(hh - dd * 24);
				let str = "";
				if (dd) {
					str += (dd+"天")
				}
				if (hh) {
					str += (hh+"时")
				}
				if (mm) {
					str += (mm+"分")
				}
				if (ss) {
					str += (ss+"秒")
				}
				return str;
			},
			// 快速核销
			orderFistVerify(){
				let that = this;
				let num = that.orderVerify.num;
				let _id = that.data.orderInfo._id;
				vk.callFunction({
					url: 'client/order.orderVerify',
					loading:true,
					data: {
						_id,
						num
					},
					success: (data) => {
						vk.alert(data.msg);
						that.data.orderInfo = data.orderInfo;
						if (data.orderInfo.status === 5) {
							that.orderVerify.show = false;
						}
					}
				});
			},
			pageToComment(){
				let that = this;
				let _id = that.data.orderInfo._id;
				vk.navigateTo({
					url: `/pages/user/order/comment?_id=${_id}`,
					events: {
						// 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
						update: (data) => {
							// 当B页面运行 eventChannel.emit('update', { a:1 }); 时，会运行这里的代码逻辑。
							vk.pubfn.objectAssign(that.data.orderInfo, data);
							that.initOrder(that.data.orderInfo);
						}
					}
				});
			},
			async pageToGwc(){
				let order_no = this.data.orderInfo.order_no;
				// 记录临时购物车数据
				await vk.myfn.cart.addTemp(this.data.orderInfo.goods_sku_list);
				vk.navigateTo({
					url: `/pages/goods/goods-cart?order_no=${order_no}`
				});
			},
			navigationShop(){
				let shopInfo = this.data.orderInfo.express_info;
				uni.openLocation({
					latitude: shopInfo.position.latitude,
					longitude: shopInfo.position.longitude,
					success: () =>{

					}
				});
			}
		},
		// 监听器
		watch:{

		},
		// 计算属性
		computed:{
			countDownTimeCom(){
				let that = this;
				let t = 0;
				let time = Date.now();
				let auto_cancel_time = vk.pubfn.getData(that.data, 'orderInfo.auto_cancel_time');
				if (auto_cancel_time){
					t = auto_cancel_time - time
				}
				if (t < 0) t = 0;
				return t;
			},
			payTypeCom(){
				let that = this;
				let payType = vk.pubfn.getData(that.data, 'orderInfo.pay_type');
				let payTypeObj = vk.getVuex('$app.config.maill.order.payType');
				return payTypeObj[payType];
			},
			// 显示申请退款按钮的计算
			showApplyRefundCom(){
				let that = this;
				let status = that.data.orderInfo.status;
				let statusType = vk.getVuex('$user.mchInfo.order_refund.status');
				let arr = [1];
				if (statusType === 1) {
					arr = [1,3,4];
				} else if (statusType === 2) {
					arr = [1,3,4,5];
				}
				if (arr.indexOf(status) > -1) {
					return true;
				} else {
					return false;
				}
			},
			maxVerifyNum(){
				let {
					buy_num = 0,
					refund_num = 0,
					verify_num = 0,
				} = uni.vk.pubfn.getData(this.data,"orderInfo.goods_sku_list[0]",{});
				return buy_num - refund_num - verify_num;
			},
			stepsListCom(){
				if (this.data.orderInfo.delivery_mode === 2) {
					return this.steps1.list3;
				}
				if (this.data.orderInfo.order_type === 1) {
					return this.steps1.list2;
				}
				return this.steps1.list;
			}
		}
	}
</script>
<style lang="scss" scoped>

	.bold{
		font-weight: bold;
	}
	.main-color{
		color: var(--main);
	}
	.card{
		background-color: #ffffff;
		margin: 20rpx;
		padding: 30rpx;
		border-radius: 20rpx;
		overflow: hidden;
		.card-title{
			font-weight: bold;
		}
	}
	.qrcode-view{
		.qrcode-title{
			text-align: center;
			font-size: 50rpx;
			font-weight: bold;
		}
		.qrcode{
			display: flex;
			justify-content: center;
			align-items: center;
			margin-top: 20rpx;
			position: relative;
			overflow: hidden;
			.verified{
				position: absolute;
				background-color: #ffffff;
				padding: 20rpx 190rpx;
				color: #000;
				font-size: 40rpx;
				transform:rotate(-45deg);
			}
		}
		.qrcode-btn{
			display: flex;
			justify-content: center;
			margin-top: 20rpx;
		}
		.qrcode-tips{
			margin-top: 20rpx;
		}
	}
	.address-info{
		font-size: 26rpx;
		.address-user{
			display: flex;
			align-items: center;
			.address-nickname{
				flex: 1;
				.nickname{
					margin-left: 20rpx;
				}
			}
			.address-mobile{
				font-weight: bold;
				letter-spacing: 1px;
			}
		}
		.address-text{
			color: #696b6f;
			margin-top: 20rpx;
		}
		.address-navigation{
			text-align: right;
			color: var(--main);
			margin-top: 20rpx;
		}
	}

	.cell-box{
		display: flex;
		padding: 20rpx 0;
		.cell-left{
			text-align: left;
			color: #606266;
		}
		.cell-right{
			flex: 1;
			text-align: right;
		}
	}

	.navigation{
		position: fixed;
		bottom: 0;
		border-top: solid 2rpx #f2f2f2;
		background-color: #ffffff;
		width: 100%;
		z-index: 99;
		.navigation-main{
			display: flex;
			position: relative;
			padding: 20rpx 10rpx;
			align-items: center;
			.navigation-main-left{
				display: flex;
				justify-content: flex-start;
			}
			.navigation-main-right{
				display: flex;
				flex: 1;
				justify-content: flex-end;
			}
			.navigation-btn{
				color: #666666;
				background-color: #ffffff;
				border: 2rpx solid #999999;
				padding: 10rpx 30rpx;
				border-radius: 40rpx;
				font-size: 30rpx;
				font-weight: 500;
				margin: 0 10rpx;
			}
			.navigation-btn.main{
				color: var(--main);
				background-color: #ffffff;
				border: 2rpx solid var(--main);
			}
			.navigation-btn.cancel{
				color: #999999;
				background-color: #ffffff;
				border: 2rpx solid #999999;
			}
			.navigation-btn:active{
				background-color: rgba(0,0,0,0.2);
			}
		}
		.navigation-inset-bottom{
			height: 0;
			height: constant(safe-area-inset-bottom);
			height: env(safe-area-inset-bottom);
			display: block;
			width: 100%;
		}
	}


	/* 底部安全区域 */
	.safe-area-inset-bottom{
		height: calc(120rpx);
		height: calc(120rpx + constant(safe-area-inset-bottom));
		height: calc(120rpx + env(safe-area-inset-bottom));
		display: block;
	}

	.u-order-title {
		color: #333333;
		font-weight: bold;
		font-size: 28rpx;
	}

	.u-order-desc {
		color: rgb(150, 150, 150);
		font-size: 24rpx;
		margin-bottom: 6rpx;
	}

	.u-order-time {
		color: rgb(200, 200, 200);
		font-size: 24rpx;
	}

	.contact{
		border: 0;
		line-height: initial;
		font-size: 24rpx;
		padding: 0;
		margin: 0;
	}
</style>
